.upgrade {
  // padding-top: 20rpx;
  padding-bottom: 256rpx;
}
.text {
  margin-top: -100rpx;
  font-weight: 400;
  font-size: 28rpx;
  color: #8c8c8c;
  line-height: 48rpx;
  text-align: center;
  font-style: normal;
  text-transform: none;
}
.mycard {
  text-align: center;

  .cearte {
    width: 686rpx;
    height: 80rpx;
    background: #01ada8;
    border-radius: 570rpx 570rpx 570rpx 570rpx;
    margin: 0 auto;
    margin-top: 40rpx;
    .btn {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      height: 100%;
      text {
        margin-left: 10rpx;
        font-weight: 400;
        font-size: 28rpx;
        color: #ffffff;
        line-height: 40rpx;
        text-align: left;
        font-style: normal;
        text-transform: none;
      }
    }
  }
}

.mycard-info {
  width: 750rpx;
  position: relative;
  .info-bg {
    width: 100%;
    height: 564rpx;
    overflow: hidden;

    image {
      width: 100%;
      height: 100%;
    }
  }

  .mycard-info_box {
    position: absolute;
    top: 390rpx;
    left: 24rpx;
    padding-bottom: 256rpx;

    .qr_code {
      width: 288rpx;
      height: 440rpx;
      margin: 0 auto;
      text-align: center;
      text {
        font-weight: 400;
        font-size: 28rpx;
        color: #8c8c8c;
        line-height: 40rpx;
        text-align: center;
        font-style: normal;
        text-transform: none;
        white-space: nowrap;
        margin-top: 16rpx;
      }
      .qr_code_img {
        width: 288rpx;
        height: 288rpx;
        // background: red;
        image {
          width: 100%;
          height: 100%;
        }
      }
    }
  }

  .card_info {
    width: 702rpx;
    // height: 638rpx;
    background: #ffffff;
    box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(0, 0, 0, 0.08);
    border-radius: 20rpx 20rpx 20rpx 20rpx;

    .card_info_box {
      width: 638rpx;
      height: auto;
      margin: 0 auto;
      padding-top: 48rpx;
      .card_info_top {
        width: 638rpx;
        height: 112rpx;
        margin-bottom: 32rpx;
        display: flex;
        align-items: center;
        justify-content: space-between;

        .card_info_top_left {
          width: 300rpx;
          height: 112rpx;
          display: flex;
          justify-content: space-between;
          align-items: center;
          .card_info_top_img {
            width: 112rpx;
            height: 112rpx;
            image {
              width: 112rpx;
              height: 112rpx;
              border-radius: 112rpx;
            }
          }
          .card_info_top_text {
            width: 168rpx;
            height: 90rpx;
            display: flex;
            flex-direction: column;
            text:nth-child(1) {
              // width: 120rpx;
              height: 56rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: bold;
              font-size: 40rpx;
              color: #333333;
              line-height: 56rpx;
              text-align: left;
              font-style: normal;
              text-transform: none;
              padding-bottom: 5rpx;
            }

            text:nth-child(2) {
              // width: 168rpx;
              height: 34rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 400;
              font-size: 24rpx;
              color: #262626;
              line-height: 34rpx;
              text-align: left;
              font-style: normal;
              text-transform: none;
            }
          }
        }

        .card_info_top_right {
          width: 84rpx;
          height: 84rpx;
          image {
            width: 84rpx;
            height: 84rpx;
          }
        }
      }
      .card_info_middle {
        width: 638rpx;
        height: 212rpx;
        margin-bottom: 40rpx;
        padding-bottom: 40rpx;
        font-size: 24rpx;

        .card_info_middle_list {
          width: 638rpx;
          margin-bottom: 20rpx;
          display: flex;
          image {
            width: 32rpx;
            height: 32rpx;
          }
          text {
            height: 38rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 400;
            font-size: 24rpx;
            color: #595959;
            line-height: 38rpx;
            text-align: left;
            font-style: normal;
            text-transform: none;
            margin-left: 8rpx;
            line-height: 38rpx;
          }
          .address_text {
            height: 38rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 400;
            font-size: 24rpx;
            color: #8c8c8c;
            line-height: 38rpx;
            text-align: left;
            font-style: normal;
            text-decoration-line: underline;
            text-transform: none;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
          }
          .address_click {
            width: 160rpx;
            height: 38rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 400;
            font-size: 24rpx;
            color: #bfbfbf;
            line-height: 38rpx;
            text-align: left;
            font-style: normal;
            text-transform: none;
            white-space: nowrap;
          }
        }
      }

      .card_info_btn {
        width: 638rpx;
        height: 88rpx;
        background: #01ada8;
        box-shadow: 0rpx 8rpx 20rpx 0rpx rgba(1, 173, 168, 0.3);
        border-radius: 324rpx 324rpx 324rpx 324rpx;
        margin-bottom: 40rpx;
        text-align: center;
        line-height: 88rpx;

        text {
          width: 128rpx;
          height: 44rpx;
          font-family: PingFang SC, PingFang SC;
          font-weight: 400;
          font-size: 32rpx;
          color: #fefdfd;
          line-height: 44rpx;
          text-align: center;
          font-style: normal;
          text-transform: none;
        }
      }

      .card_info_footer {
        width: 638rpx;
        height: auto;
        margin-bottom: 32rpx;
        ::v-deep .u-line {
          display: none;
        }
        ::v-deep .u-cell__title {
          text-align: center;
        }
        ::v-deep .u-cell__body__content {
          flex: none;
          color: #8c8c8c;
          font-size: 24rpx;
        }
        ::v-deep .u-cell__body {
          justify-content: center;
        }

        ::v-deep .u-collapse-item__content__text {
          padding: 12rpx 0 !important;
        }
        .card_info_middle {
          width: 638rpx;
          height: 212rpx;
          margin-bottom: 40rpx;
          font-size: 24rpx;
          padding-bottom: 40rpx;

          .card_info_middle_list {
            width: 638rpx;
            margin-bottom: 20rpx;
            display: flex;
            justify-content: space-between;
            align-items: center;
            .middle_list_left {
              display: flex;
              justify-content: space-between;
              align-items: center;
            }
            image {
              width: 40rpx;
              height: 40rpx;
            }
            text {
              height: 38rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 400;
              font-size: 24rpx;
              color: #595959;
              line-height: 38rpx;
              text-align: left;
              font-style: normal;
              text-transform: none;
              margin-left: 8rpx;
              line-height: 38rpx;
            }
            .address_text {
              height: 38rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 400;
              font-size: 24rpx;
              color: #8c8c8c;
              line-height: 38rpx;
              text-align: left;
              font-style: normal;
              text-transform: none;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
            }
            .address_click {
              width: 160rpx;
              height: 38rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 400;
              font-size: 24rpx;
              color: #bfbfbf;
              line-height: 38rpx;
              text-align: left;
              font-style: normal;
              text-transform: none;
              white-space: nowrap;
            }
            .middle_list_right {
              width: 400rpx;
              color: #262626;
              text-align: right;
              .middle_list_right_text {
                height: 42rpx;
                background: rgba(1, 173, 168, 0.05);
                border-radius: 8rpx 8rpx 8rpx 8rpx;
                color: #01ada8;
                font-size: 24rpx;
              }
            }
          }
        }
      }
    }
  }

  .card-item {
    width: 702rpx;
    height: 170rpx;
    background: #ffffff;
    border-radius: 20rpx 20rpx 20rpx 20rpx;
    display: flex;
    align-items: center;
    margin-bottom: 20rpx;

    .card-item-list {
      width: 174rpx;
      height: 104rpx;
      display: flex;
      flex-direction: column;
      align-items: center;
      image {
        width: 56rpx;
        height: 56rpx;
      }
      text {
        width: 174rpx;
        height: 38rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 400;
        font-size: 24rpx;
        color: #262626;
        line-height: 38rpx;
        text-align: center;
        font-style: normal;
        text-transform: none;
        margin-top: 10rpx;
      }
    }
  }

  .mycard_data {
    width: 702rpx;
    // height: 580rpx;
    background: #ffffff;
    border-radius: 20rpx 20rpx 20rpx 20rpx;

    .mycard_data_title {
      width: 120rpx;
      height: 42rpx;
      font-family: PingFang SC, PingFang SC;
      font-weight: bold;
      font-size: 30rpx;
      color: #333333;
      line-height: 42rpx;
      display: block;
      padding-top: 24rpx;
      padding-left: 24rpx;
      padding-bottom: 32rpx;
    }

    .mycard_data_box {
      width: 100%;
      height: 76rpx;
      display: flex;
      margin-bottom: 32rpx;
      .mycard_data_box_item {
        width: 234rpx;
        height: 76rpx;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;

        .box-item-num {
          width: 28rpx;
          height: 38rpx;
          font-family: PingFang SC, PingFang SC;
          font-weight: 400;
          font-size: 28rpx;
          color: #262626;
          line-height: 38rpx;
          text-align: left;
          font-style: normal;
          text-transform: none;
        }
        .box-item-title {
          width: 234rpx;
          height: 38rpx;
          font-family: PingFang SC, PingFang SC;
          font-weight: 400;
          font-size: 24rpx;
          color: #8c8c8c;
          line-height: 38rpx;
          text-align: center;
          font-style: normal;
          text-transform: none;
        }
      }
    }

    .mycard_data_visitor {
      width: 638rpx;

      .visitor_title {
        width: 96rpx;
        height: 34rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 400;
        font-size: 24rpx;
        color: #8c8c8c;
        line-height: 34rpx;
        text-align: left;
        font-style: normal;
        text-transform: none;
        padding-left: 24rpx;
      }
      .visitor_list {
        width: 638rpx;
        color: #595959;
        font-size: 24rpx;
        padding-left: 24rpx;
        padding-top: 24rpx;
        padding-bottom: 24rpx;

        .visitor_list_item {
          width: 100%;
          height: 34rpx;
          display: flex;
          justify-content: space-between;
        }
      }
      .card_info_footer {
        width: 638rpx;
        height: auto;
        margin-bottom: 32rpx;
        ::v-deep .u-line {
          display: none;
        }
        ::v-deep .u-cell__title {
          text-align: center;
        }
        ::v-deep .u-cell__body__content {
          flex: none;
          color: #8c8c8c;
          font-size: 24rpx;
        }
        ::v-deep .u-cell__body {
          justify-content: center;
        }
      }
    }
  }

  .mycard_player {
    width: 702rpx;
    height: 350rpx;
    border-radius: 20rpx 20rpx 20rpx 20rpx;
    position: relative;
    margin-bottom: 20rpx;

    .mycard_player_bg {
      width: 702rpx;
      height: 350rpx;
      image {
        width: 702rpx;
        height: 350rpx;
        border-radius: 20rpx 20rpx 20rpx 20rpx;
      }
    }
    .mycard_player_click {
      width: 96rpx;
      height: 96rpx;
      position: absolute;
      left: 320rpx;
      top: 128rpx;
      image {
        width: 96rpx;
        height: 96rpx;
      }
    }
  }

  .mycard_footer {
    width: 702rpx;

    .mycard_footer_title {
      width: 702rpx;
      height: 144rpx;
      background: #ffffff;
      display: flex;
      flex-direction: column;
      align-items: center;
      .title-top {
        // width: 306rpx;
        height: 48rpx;
        font-family: Source Han Serif CN, Source Han Serif CN;
        font-weight: 700;
        font-size: 34rpx;
        color: #000000;
        line-height: 48rpx;
        text-align: left;
        font-style: normal;
        text-transform: none;
        padding-top: 28rpx;

        position: relative;
      }
      .title-top::after {
        content: "";
        width: 1rpx;
        height: 85%;
        background-color: #000000;
        position: absolute;
        left: -10rpx;
        top: 35rpx;
      }
      .title-top::before {
        content: "";
        width: 1rpx;
        height: 85%;
        background-color: #000000;
        position: absolute;
        right: -10rpx;
        top: 35rpx;
      }
      .title-footer {
        // width: 308rpx;
        height: 28rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 400;
        font-size: 20rpx;
        color: #999999;
        line-height: 28rpx;
        letter-spacing: 8px;
        text-align: left;
        font-style: normal;
        text-transform: none;
        padding-top: 2rpx;
      }
    }

    .mycard_footer_img {
      width: 702rpx;
      height: 604rpx;
      image {
        width: 702rpx;
        height: 604rpx;
      }
    }

    .mycard_footer_item {
      width: 702rpx;
      height: 384rpx;
      background: #ffffff;
      padding-top: 20rpx;
      display: flex;
      justify-content: space-between;
      flex-direction: column;
      .mycard_footer_item-title {
        width: 224rpx;
        height: 34rpx;
        font-family: Alimama Agile VF, Alimama Agile VF;
        font-weight: 700;
        font-size: 28rpx;
        color: #262626;
        line-height: 34rpx;
        text-align: left;
        font-style: normal;
        text-transform: none;
        padding-left: 20rpx;
      }
      .mycard_footer_item_list {
        width: 604rpx;
        height: 320rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: bold;
        font-size: 22rpx;
        color: #333333;
        line-height: 40rpx;
        text-align: left;
        font-style: normal;
        text-transform: none;
        padding-left: 20rpx;
      }
    }
  }
}
